<template>
  <div class="pageContainer">
    <div class="pageHeader">
      <div class="positionItem listInfo">
        <div class="itemInfo leftInfo">
          <h3>{{positionDetail.name}}</h3>
          <p>{{positionDetail.workPlace}}/{{positionDetail.educationRequirements}}</p>
        </div>
        <div class="itemInfo rightInfo">
          <span>{{positionDetail.salaryRange}}</span>
        </div>
      </div>
    </div>
    <div class="pageMain">
      <div class="infos ">
        <span class="title">岗位职责</span>
        <div class="contents">
          {{positionDetail.responsibilities }}

          <!-- 1、 负责法律文件的审核、起草工作；<br/>
          2、 负责相关协议、合同等的核对、用印、归档及管理工作；<br/>
          3、 协助处理公司各类法律事务、法律风险规避等工作；<br/>
          4、 协助配合初步的法律研究；<br/>
          5、 完成领导安排的其他工作任务。 -->
        </div>
      </div>
      <div class="infos ">
        <span class="title">岗位要求</span>
        <div class="contents">
          {{positionDetail.jobRequirements}}
          <!-- 1、全日制本科及以上学历，法学相关专业；<br/>
          2、具有公司法务助理或律所相关工作/实习经验<br/>
          3、Word、Excel等办公软件操作熟练；<br/>
          4、具有较强的沟通能力、分析应变能力和较好的文字功底；<br/>
          5、工作踏实、仔细、积极主动、责任心强，具有良好的职业操守。<br/> -->
        </div>
      </div>
    </div>
    <div class="fixed">
      <div class="emailWrapper">
        <div class="emailInfo">若您无法上传文档申请职位请发送简历至HR邮箱：boxia.hong@birdsat.cn</div>
        <div class="emailCopy">
          <div class="copy" @click="copy">赋值邮箱</div>
        </div>
      </div>
      <div class="footer">
        <van-button type="primary" color="#0079fe" block >申请岗位</van-button>
        <van-uploader class="btnUploader" :after-read="afterRead" />
      </div>
    </div>
  </div>
</template>
<script>
import {getPositionDetailById,positionApplyFor} from '../../services'
// import {Toast} from 'vant'
export default {
  data() {
    return {
      positionDetail:{}
    }
  },
 created() {
    console.log('router',this.$route.params)
    let id = this.$route.params.id
    getPositionDetailById(id).then(d=>{
      console.log(id+'职位详情',d.data)
      this.positionDetail = d.data
    })
  },
  methods: {
    copy() {
        let text = 'boxia.hong@birdsat.cn'
        var textareaEl = document.createElement('textarea');
        textareaEl.setAttribute('readonly', 'readonly'); // 防止手机上弹出软键盘
        textareaEl.value = text;
        document.body.appendChild(textareaEl);
        textareaEl.select();
        var res = document.execCommand('copy');
        document.body.removeChild(textareaEl);
        this.$toast('复制成功')
        return res
    },
    afterRead(file){
      console.log('file',file)
      
      let formData = new FormData()
      formData.append('file',file.file)
      // formData.append('positionId',this.$route.params.id)
      this.positionApply(formData)
    },
    positionApply(formdata){
      positionApplyFor(formdata,this.$route.params.id).then(d=>{
        console.log('申请',d.data)
        this.$notify({message:'申请成功',type: 'success'})
      })
    }
  },
}
</script>
<style lang="less">
  .btnUploader{
    display: block;
    position: absolute;
    top: 0;
    opacity: 0;
    width:100%;
    height:44px;
    .van-uploader__wrapper{
      .van-uploader__upload{
        width: 100%;
        height: 44px;
        margin:0;
        
      }
    }
    
  }
</style>
<style lang="less" scoped>
  .listInfo{
    margin: 0;
  }
  .pageContainer{
    padding: 10px;
   
  }
  .pageMain{
    background-color: #ffffff;
    margin-top: 20px;
    padding: 5px;
    .infos{ 
      .title{
        color:#999;
        font-size: 14px;
      }
      .contents{
        font-size: 13px;
        line-height: 25px;
        color: #666;
      }
    }
  }
  .emailWrapper{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0;
    .emailInfo{
      padding-right: 5px;
      flex: 1;
      color:#3333337f;
      font-size: 14px;
    }
    .emailCopy{
      .copy{
        color: rgba(255, 0, 0, 0.686274509803922);
        cursor: pointer;
        padding: 5px 20px 5px 20px;
        border-radius: 8px;
        font-size: 13px;
        text-align: center;
        background-color: #d7d7d7;
      }
    }
  }
  .footer{
    position: relative;
  }
  .fixed{
    padding: 10px;
    position: fixed;
    left:0;
    bottom:5px;
  }
  
  
</style>